<template>
    <el-select
        v-model="value"
        :disabled="disabled"
        :remote-method="queryList"
        :size="size"
        :multiple="multiple"
        :type="type"
        remote
        :clearable="clearable"
        :collapse-tags="collapseTags"
        style="width: 100%;"
        @change="handleChange"
    >
        <el-option
            v-for="item in dataList"
            :key="item.id"
            :label="item.sceneName+'('+ item.startTime + '-' + item.endTime +')'"
            :value="item.id"
        />
    </el-select>
</template>
<script>
import API from "common/src/api/undGraExamArrange/undergraduateExamScene";
import UTILS from "common/src/utils/utils";

/**
 * 排考周数下拉框组件
 */
export default {
    name: "ExamSenceSelect",
    props: {
        value: {
            required: true
        },
        examType: {
            type: Number,
            default: 1
        },
        disabled: {
            type: Boolean,
            default: false
        },
        multiple: {
            type: Boolean,
            default: false
        },
        collapseTags: {
            type: Boolean,
            default: false
        },
        size: {
            type: String,
            default: ""
        },
        clearable: {
            type: Boolean,
            default: true
        },
        activetip:{
          type: Number,
          default: null
        }
    },
    data() {
        return {
            dataList: [],
            queryForm: {
                condition: {
                    examType: ""
                },
                pageNum_: 0,
                pageSize_: 0
            }
        };
    },
    computed: {},
    mounted() {
        this.init();
    },
    created() {
        if (this.multiple && !Array.isArray(this.value)) {
            this.$emit("input", []);
        }
        if (!this.multiple && Array.isArray(this.value)) {
            this.$emit("input", "");
        }
    },
    activated(){
      if(this.activetip==1){
        this.init();
      }
    },
    watch: {
        examType: {
            handler: function(newVal, oldVal) {
                this.init();
            }
        }
    },
    methods: {
        handleChange(val) {
            this.$emit("input", val);
            this.$emit("change", val);
        },
        reset() {
          this.init();
        },
        init() {
            this.queryForm.condition.examType = this.examType;
            API.getListPage(this.queryForm).then(res => {
                if (res.code == 200) {
                    this.dataList = res.data.list;
                }
            });
        },
        getOptions() {
            return this.dataList;
        }
    }
};
</script>

<style scoped lang="scss">
</style>
